<template>
  <div>
    <el-dialog
      v-model="state.dialogVisible"
      title="选择参会部门"
      width="50%"
      @open="openDialog"
      class="dialogStyle"
    >
      <tableIndex
        :tableData="state.tableData"
        :isIndex="false"
        :height="500"
        :isSelection="false"
        :isPaging="false"
        :fields="state.fields"
        :tableHead="state.tableHead"
        @searchList="searchList"
      >
        <template #operate>
          <el-table-column label="操作" width="200" align="center" fixed="right">
            <template #default="{ row }">
              <el-button
                size="small"
                class="button_edit"
                type="primary"
                @click="projectProposal(row)"
                >选择</el-button
              >
            </template>
          </el-table-column>
        </template>
      </tableIndex>

      <template #footer>
        <span class="dialog-footer">
          <el-button @click="state.dialogVisible = false" class="button_cancel2">取消</el-button>
          <el-button @click="state.dialogVisible = false" class="button_view">
            确定
          </el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>
<script setup>
import { ref, reactive, onMounted, onBeforeUnmount } from 'vue'
import tableIndex from '@/components/table/index.vue'
import { department } from '@/api/project'

const state = reactive({
  tableHead: [
    {
      prop: 'departmentName',
      label: '部门名称'
    }
  ],
  dialogVisible: false,
  tableData: [],
  fields: [
    {
      key: 'departmentName',
      label: '部门名称',
      type: 'input',
      placeholder: '部门名称关键字搜索'
    }
  ]
})
const emits = defineEmits(['submitRow'])
const projectProposal = (row) => {
  emits('submitRow',row)
  state.dialogVisible=false
}
const openDialog = () => {
  getAllDepartment()

}
//获取所有部门
const getAllDepartment = (param) => {
  department.getSearchDepartments(param).then((res) => {
    if (res.code == '200') {
      state.tableData = res.data
    }
  })
}
const searchList=(obj)=>{
  getAllDepartment(obj.departmentName)
}
defineExpose({
  state
})
</script>
<style lang="scss" scoped>
@import '@/views/constructionProjectManage/static/dialog.scss';
</style>
